<script setup lang="ts">
function ToLogin() {
  uni.navigateTo({
    url: "../../LogReg/Login/Login",
  });
}
</script>
<template>
  <view>
    <view class="uni-margin-wrap">
      <swiper class="swiper" :indicator-dots="true">
        <swiper-item>
          <view class="swiper-item uni-bg-red">A</view>
        </swiper-item>
        <swiper-item>
          <view class="swiper-item uni-bg-green">B</view>
        </swiper-item>
        <swiper-item>
          <view class="swiper-item uni-bg-blue">
            <button class="ToLog" :plain="true" @click="ToLogin">
              <span>立即体验</span>
            </button>
          </view>
        </swiper-item>
      </swiper>
    </view>
  </view>
</template>
<style lang="less" scoped>
.swiper {
  width: 100vw;
  height: 100vh;
  .uni-bg-red {
    width: 100vw;
    height: 100vh;
    background-color: red;
  }
  .uni-bg-green {
    width: 100vw;
    height: 100vh;
    background-color: green;
  }
  .uni-bg-blue {
    width: 100vw;
    height: 100vh;
    background-color: blue;
  }
}
.ToLog {
  width: 350rpx;
  height: 90rpx;
  position: absolute;
  left: 0;
  right: 0;
  top: 40%;
  bottom: 0;
  margin: auto;
  display: flex;
  justify-content: center;
  align-items: center;
}
</style>
